<template>
	<view class="notice-view" v-if="list.length > 0">
		<uni-notice-bar show-get-more show-icon :text="model.title" @getmore.native="handleGetMore"
			@click="handleClickMore" />
	</view>
</template>

<script setup>
import {
	ref,
	onMounted,
	onUnmounted
} from 'vue'
import {
	postFormAction
} from "@/utils/request";
const url = {
	list: '/visual/list'
}
const list = ref([])
const currentIndex = ref(0)
const timer = ref(null)
const model = ref({})
const moduleCode = '17184995529796789195'
const init = async () => {
	clearInterval(timer.value)
	currentIndex.value = 0
	const res = await postFormAction(url.list, {
		moduleCode
	})
	list.value = res?.data?.list || []
	if (list.value && list.value.length) {
		model.value = list.value[currentIndex.value]
		if (list.value.length > 1) {
			timer.value = setInterval(() => {
				++currentIndex.value
				if (currentIndex.value > list.value.length - 1) {
					currentIndex.value = 0
				}
				model.value = list.value[currentIndex.value]
			}, 3000)
		}
	}
}
const fetch = () => {
	init()
}
onMounted(fetch)
onUnmounted(() => {
	clearInterval(timer.value)
})
const handleClickMore = () => {
	uni.navigateTo({
		url: `/application/moduleShow?record=${JSON.stringify({
			id: list.value[currentIndex.value].id,
			moduleCode: moduleCode,
		})}`,
	});
}
const handleGetMore = () => {
	uni.navigateTo({
		url: `/application/moduleList?record=${JSON.stringify({ code: moduleCode })}`,
	});
}
</script>
<style lang='scss' scoped>
.notice-view {
	border-radius: 16rpx;
}

::v-deep .uni-noticebar__content-text {
	color: #ff7803 !important;
}
</style>